import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    todos: Array(6).fill(null).map((v, i) => ({
      id: i + 1,
      title: '待办事项' + (i + 1),
      completed: false
    }))
  },
  mutations: {
    addTodoItem(state, payload) {
      state.todos.push({
        id: Math.random(),
        title: payload.title,
        completed: false
      })
    },
    toggleTodoItem(state, payload) {
      state.todos = state.todos.map(item => {
        const copy = { ...item }
        if (copy.id === payload.id) {
          copy.completed = !copy.completed
        }
        return copy
      })
    },
    removeTodoItem(state, payload) {
      state.todos = state.todos.filter(item => item.id !== payload.id)
    }
  }
})